<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>BMS</title>
    <script type="text/javascript" src="<s:url value="/js/jquery.validate.min.js"/>"></script>
    <script type="text/javascript" src="<s:url value="/js/therapeuticArea.js"/>"></script>
</head>
<body>

<s:form id="formEdit" cssClass="tableEdit" cssStyle="text-align: center" >
    <tr>
        <th colspan="4" class="tableTitle">
            <h5>Therapeutic Area</h5>
        </th>
    </tr>

    <s:hidden name="id" value="%{therapeuticArea.id}"/>


    <table id="table_speciality" style="margin:-55px 5% 5% 30%;">
        <tr>
            <th><label>Therapeutic Area: </label></th>
            <th><s:textfield name="name" value="%{therapeuticArea.name}" theme="simple" cssStyle="margin-left:12px;" cssClass="required"/></th>
        </tr>
        <s:if test="therapeuticArea.id == null || therapeuticArea.specialities == null ||  therapeuticArea.specialities.isEmpty()">
            <tr>
                <th><label>Specialty: </label></th>
                <th><s:textfield name="therapeuticArea.specialities[0].name" value="%{therapeuticArea.specialities[0].name}" theme="simple" cssStyle="margin-left:12px;" cssClass="required"/></th>
                <TH><a onclick="deleteRow('table_speciality', this)"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></TH>
                <TH><a style="text-align: right" onclick="addRowSpecialty('table_speciality')"><img src="<s:url value="/images/add2.png"/>" alt="Add Row"></a></TH>
            </tr>
        </s:if>
        <s:else>
            <s:iterator value="%{therapeuticArea.specialities}"  status="stat">
                <tr>
                    <th><label><s:if test="#stat.index == 0">Specialty: </s:if></label></th>
                    <th><s:textfield name="therapeuticArea.specialities[%{#stat.index}].name" value="%{therapeuticArea.specialities[#stat.index].name}" theme="simple" cssStyle="margin-left:12px;" cssClass="required"/></th>
                    <TH><a onclick="deleteRow('table_speciality', this)"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></TH>
                    <TH><a style="display:none; text-align: right" onclick="addRowSpecialty('table_speciality')"><img src="<s:url value="/images/add2.png"/>" alt="Add Row"></a></TH>
                </tr>
            </s:iterator>
        </s:else>
    </table>

    <br>
    <tr>
        <td colspan="2" class="centeredButtons">
            <s:submit value="Save" id="save" action="save" onclick="validate();" theme="simple" />
        </td>

    </tr>


</s:form>


<script type="text/javascript">
    $('#therapeuticArea').css({"color":"#EE5102","fontWeight":"bold"});
</script>

</body>
</html>


